<template>
	<view class="code">
		<view class="card">
			<view class="title">用户：{{ userInfo.name || 'xx' }}</view>
			<view class="qrcode">
				<u--image :src="qrCodeUrl" width="300rpx" height="300rpx" :showMenuByLongpress="false" @click="$showImgprview(qrCodeUrl, [])"></u--image>
			</view>
			<view class="desc"></view>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex'; //引入mapMutations
export default {
	data() {
		return {
			qrCodeUrl: ''
		};
	},
	onLoad() {
		this.$initConfig(true).then((_) => {
			this.getInfo();
		});
	},
	computed: {
		...mapState(['userInfo'])
	},
	methods: {
		getInfo() {
			let _this = this;
			wx.qy.checkSession({
				success: function () {
					console.log('未过期');
					//session_key 未过期，并且在本生命周期一直有效
					_this.getQr();
				},
				fail: function () {
					// session_key 已经失效，需要重新执行登录流程
					console.log('已过期');
					wx.qy.login({
						success: function () {
							console.log('登录成功');
							_this.getQr();
						},
						fail: function () {
							_this.$u.toast('登录失败！退出重试');
						}
					}); //重新登录
				}
			});
		},
		getQr() {
			let _this = this;
			wx.qy.getQrCode({
				success: function (res) {
					console.log(res);
					var qrCode = res.qrCode;
					_this.qrCodeUrl = qrCode;
				},
				fail(err) {
					console.log('err', err);
					_this.$u.toast('获取二维码失败');
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.code {
	.card {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 200rpx;
		.title {
			margin-bottom: 20rpx;
			width: 300rpx;
		}
	}
}
</style>
